<template>
  <div class="lottie-bg">
    <md-field >
      <md-field>
        <p style="text-align:center; margin-top:40px;">
          <span style="display:block; font-size:20px;">
            <template>不在登录状态</template>
          </span>
        </p>
      </md-field>
      <md-field>
        <md-field-item></md-field-item>
        <md-button type="primary" @click="onSubmitRelogin">重新登录</md-button>
      </md-field>
    </md-field>
  </div>
</template>

<script>
import { toLogin } from '@libs/login'
import { Field, CellItem, Skeleton, Button, FieldItem } from 'mand-mobile'

export default {
  name: "Relogin",
  components: {
    [Field.name]: Field,
    [CellItem.name]: CellItem,
    [Skeleton.name]: Skeleton,
    [Button.name]: Button,
    [FieldItem.name]: FieldItem
  },
  data () {
    return {
    }
  },
  methods: {
    onSubmitRelogin () {
      toLogin()
    }
  }
}
</script>

<style scoped>
.lottie-bg {
  position: fixed;
  left: 0;
  top: 0;
  background-color: #fff;
  width: 100%;
  height: 100%;
  z-index: 999;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
}

#lottie {
  width: 35%;
  display: block;
  overflow: hidden;
  transform: translate3d(0, 0, 0);
  margin: auto;
}
</style>
